<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>登录</title>
		<link rel="shortcut icon " type="images/x-icon" href="../images/ico.ico">
		<meta name = "viewport" content = "width = device-width, initial-scale = 1.0,
			 maximum-scale = 1.0, user-scalable = 0" />
		<link rel="stylesheet" href="../css/main.css" />
		<link rel="stylesheet" href="../css/style.css" />
		
	</head>
	<body class="blue">
		<div id="login">
			<img src="../images/plane.png" class="plane">
			<div class="loginDiago">
				<nav>登录</nav>
				<div class="block">
					<img src="../images/phone.png" />
					<input type="text" placeholder="请输入您的手机号码" v-model="phone"  maxlength="11"/>
				</div>
				<div class="block">
					<img src="../images/lock.png" />
					<input type="password" placeholder="6-20位数字字母组合密码" v-model="passWord"  maxlength="27"/>
				</div>
				<!--<mt-button class="btnBlue" @click.native="login" style="height:1rem;font-size:.45rem;margin-bottom:0;">登录</mt-button>-->
				<button @click="login" class="btnBlue">登录</button>
				<!--<p class="forgot">-->
				<a class="forgot" href="forgetPassword.html">忘记密码?</a>
				<!--</p>-->
			</div>
			
			<div class="register">
				<mt-button class="btnRegister" @click.native="register">没有账号？立即注册</mt-button>
			</div>
			
		</div>
	</body>
	<script type="text/javascript" src="../js/rem.js" ></script>
	<script type="text/javascript" src="../js/vue.js" ></script>
	<script type="text/javascript" src="../js/mint2.2.13.js" ></script>
	<script type="text/javascript">
		new Vue({
			el:"#login",
			data:{
				phone:"",
				passWord:""
			},
			methods:{
				//点击登录
				login(){
					var phone=this.phone.replace(/\s/g,'');
					var passWord=this.passWord.replace(/\s/g,'');
					const regPhone=/^1[0-9]{10}$/;
					const regPass=/^[a-zA-Z0-9]{6,20}$/;
					const self=this;
					
					if(phone === ""){
						this.$toast({
						  message: '手机号不能为空',
						  position: 'center',
						  duration: 1500
						});
						return;
					}else if(regPhone.test(phone) == false){
						this.$toast({
						  message: '手机号码格式不正确',
						  position: 'center',
						  duration: 1500
						});
						return;
					}else if(passWord === ""){
						this.$toast({
						  message: '密码不能为空',
						  position: 'center',
						  duration: 1500
						});
						return;
					}else if(regPass.test(passWord) == false){
						this.$toast({
						  message: '请输入6-20位数字字母组合密码',
						  position: 'center',
						  duration: 1500
						});
						return;
					}
					//登录验证
//					axios.post("url",{
//						params:{
//							phone:phone,
//							password:passWord
//						}
//					}).then(function(response){
//						console.log(response.data);
//						window.location.href="apply.html";
//					});
					
				},
				//点击注册
				register(){
					window.location.href="register.html";
				}
			}
		})
	</script>
	
</html>
